<template>
    <ElTable class="list-table is-border" height="720" :="$attrs" :span-method="spanMethod" border :data="list">
        <ElTableColumn label="续费日期" prop="xfrq" align="center"></ElTableColumn>
        <ElTableColumn label="订单类型" prop="ddlxName" align="center"></ElTableColumn>
        <ElTableColumn label="客户名称" prop="khmc" align="center"></ElTableColumn>
        <ElTableColumn label="店铺名称" prop="dpmc" align="center"></ElTableColumn>
        <ElTableColumn label="业务名称" prop="ywmc" align="center"></ElTableColumn>
        <ElTableColumn label="服务类型" prop="fwlxName" align="center"></ElTableColumn>
        <ElTableColumn label="服务班次" prop="fwbcName" align="center"></ElTableColumn>
        <ElTableColumn label="收费模式" prop="sfmsVal" align="center"></ElTableColumn>
        <ElTableColumn label="业务底薪" prop="ywdx" align="center"></ElTableColumn>
        <ElTableColumn label="提成点数" prop="tcds" align="center"></ElTableColumn>
        <ElTableColumn label="咨询量" prop="zxl" align="center"></ElTableColumn>
        <ElTableColumn label="业务开始日期" prop="ywksrq" align="center"></ElTableColumn>
        <ElTableColumn label="业务结束日期" prop="ywjsrq" align="center"></ElTableColumn>
        <ElTableColumn label="是否开票" prop="sfkpVal" align="center"></ElTableColumn>
        <ElTableColumn label="发票类型" prop="fplxName" align="center"></ElTableColumn>
        <ElTableColumn label="票面税点" prop="pmsdName" align="center"></ElTableColumn>
        <ElTableColumn label="支付状态" prop="zfztName" align="center"></ElTableColumn>
        <ElTableColumn label="续费状态" prop="xfztName" align="center"></ElTableColumn>
        <!-- <ElTableColumn label="批次ID" prop="batchId" align="center"></ElTableColumn> -->
        <ElTableColumn prop="_action" label="操作" fixed="right" :min-width="90" header-align="center" align="center">
            <template #default="{ row }">
                <ElButton type="primary" link @click="$emit('open-sk', row)">收款</ElButton>
                <ElButton type="primary" link @click="$emit('open-tk', row)">退款</ElButton>
                <ElButton type="primary" link @click="$emit('open-xf', row)">续费</ElButton>
            </template>
        </ElTableColumn>
    </ElTable>
</template>

<script setup lang="ts">

import { ElTableColumn } from 'element-plus';
import { ref, computed, onMounted } from 'vue'
import { addRowAndColSpan } from '@/utils/zeo'

interface Props {
    data?: any[],
}

const props = withDefaults(defineProps<Props>(), {
    data: () => []
})

const list = computed(() => {
    let l = []
    l = props.data;
    l = addRowAndColSpan(l, 'mergeGrouping', 'rowspan1', 'colspan1');
    return l;
})

const level1 = [
    'xfrq', '_action', 'batchId'
]

const spanMethod = ({ row, column }) => {
    if (level1.includes(column.property)) {
        return {
            rowspan: row.rowspan1,
            colspan: row.colspan1
        }
    }
}

</script>